<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2015/11/30
  Time: 16:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<%
    //设置无缓存
    response.setHeader("progma", "no-cache");
    response.setHeader("Cache-Control", "no-cache");
    String ctx = request.getContextPath();
    request.setAttribute("ctx", ctx);
%>

<html>
<head>
    <title>知乎话题</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="鸟趣后台管理系统">
    <meta http-equiv="description" content="鸟趣后台管理系统">
    <link rel="stylesheet" href="${ctx}/script/jquery-easyui/themes/default/easyui.css"/>
    <link rel="stylesheet" href="${ctx}/script/jquery-easyui/themes/icon.css"/>
    <script src="${ctx}/script/jquery.min.js" type="text/javascript"></script>
    <script src="${ctx}/script/jquery-easyui/jquery.easyui.min.js" type="text/javascript"></script>
    <script src="${ctx}/script/jquery-easyui/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
    <style type="text/css">
        .edittable {

        }

        .edittable input {
            width: 200px;
        }

        .edittable select {
            width: 200px;
        }
    </style>
    <script type="text/javascript">
        $.ajaxSetup({
            cache: false //关闭AJAX相应的缓存
        });
        var ctx = "${ctx}";
        $(function () {
            $("#userinfo").window("close");
        })
        function add() {
            $("#userinfo").window("open");
            $('#userform').form('clear');
        }
        function edit(id) {
            $("#userinfo").window("open");
            $('#userform').form('clear');
            $('#userform').form('load', ctx + '/admin/zhihuhuati/info?id=' + id);
        }
        function SubOk() {
            $.messager.progress();	// 显示进度条
            $('#userform').form('submit', {
                url: ctx + "/admin/zhihuhuati/save",
                onSubmit: function () {
                    var isValid = $(this).form('validate');
                    if (!isValid) {
                        $.messager.progress('close');	// 如果表单是无效的则隐藏进度条
                    }
                    return isValid;	// 返回false终止表单提交
                },
                success: function (data) {
                    $.messager.alert("系统消息", data, "info");
                    $.messager.progress('close');
                    $("#userinfo").window("close");
                    $('#dg').datagrid("reload");
                }
            });
        }
        function SubNo() {
            $("#userinfo").window("close");
        }
        function getEditHtml(val, row) {
            return "<a id=\"btn\" href=\"javascript:edit('" + row.id + "')\">编辑</a>";
        }

        function dels() {
            var rows = $("#dg").datagrid("getSelections");
            if (rows.length == 0) {
                return;
            }
            var ids = [];
            for (var i = 0; i < rows.length; i++) {
                ids.push(rows[i].id);
            }
            ids = ids.join(",");
            var data = {};
            data.ids = ids;
            $.ajax({
                url: ctx + "/admin/zhihuhuati/dels",
                data: data,
                success: function (mess) {
                    $.messager.alert('系统消息', mess, 'info');
                    $('#dg').datagrid("reload");
                },
                dataType: "text"
            });
        }

    </script>
</head>
<body style="width:100%;height:100%;">
<div id="tb">
    <a href="javascript:add()" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">新增</a>
    <a href="javascript:dels()" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true">批量删除</a>
</div>
<table class="easyui-datagrid" url="${ctx}/admin/zhihuhuati/list" pageSize="20" pageList="[10,20,30]" rowNumber="true"
       method="GET" pagination="true" fitColumns="true" autoRowHeight="true" toolbar="#tb" id="dg">
    <thead>
    <tr>
        <th field="id" checkbox="true" width="100">选择</th>
        <th field="name" width="100">名称</th>
        <th field="url" width="100">路径</th>
        <th field="status" width="100">状态</th>
        <th field="edit" align="center" formatter="getEditHtml">编辑</th>
    </tr>
    </thead>
</table>
<div id="userinfo" class="easyui-window" collapsible="false" minimizable="false" maximizable="false" modal="true"
     title="知乎话题" style="width:600px;height:230px;padding: 20px;overflow: hidden;text-align: center">
    <form id="userform" autocomplete="off"  method="post">
        <input type="hidden" name="id" id="id"/>
        <input type="hidden" name="status" id="status"/>
        <table border="0" class="edittable">
            <tr>
                <td>名称:</td>
                <td><input type="text"  class="easyui-validatebox" data-options="required:true" name="name" id="name"/></td>
            </tr>
            <tr>
                <td>路径:</td>
                <td><input type="text" style="width: 450px;" class="easyui-validatebox" data-options="required:true,validType:'url'" name="url" id="url"/></td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <a href="javascript:SubOk()" class="easyui-linkbutton"
                       data-options="iconCls:'icon-ok',plain:true">确定</a>
                    <a href="javascript:SubNo()" class="easyui-linkbutton"
                       data-options="iconCls:'icon-cancel',plain:true">取消</a>
                </td>
            </tr>
        </table>
    </form>
</div>
</body>
</html>
